.main-title {
    display: flex;
    img {
        width: 85px;
        height: 85px;
    }

    .main-text {
        margin-left: 20px;
        text-align: left;

        div {
            margin-top: 10px;
        }

        .main-text-t {
            font-size: 26px;
            font-weight: bold;
        }

        .main-text-b {
            color: #A8CCC0;

            i{
                margin-right: 10px;
            }
        }
    }
}

.main-chart {
    h3 {
        text-align: left;
        font-weight: bold;
    }
    .t-class {
        background: #fff;
        height: 397px;
        padding: 10px;
        
        p {
            line-height: 340px;
        }
    }

    .t-data {
        background: #fff;
        padding: 10px;
        
        .chart-box {
            padding: 20px;
            display: flex;
            justify-content: space-around;
            align-items: center;

            .ant-progress-text {
                font-size: 14px;
            }
        }
    }
}

.user-chart {
    width: 33.33%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-right: 1px solid #ccc;

    ul {
        font-size: 14px;
        li {

            &::before {
                content: '';
                display: inline-block;
                // padding: 0 10px;
                width: 20px;
                height: 14px;
                border-radius: 4px;
                background: #2ECC71;
                margin-right: 5px;
            }
        }
    }
}

.class-chart {
    width: 33.33%;
}

.teacher-chart {
    width: 33.33%;
}

.class-data {
    background: #fff;
    height: 204px;
    padding: 10px;

    i {
        margin-right: 5px;
    }

    .ant-tabs-tabpane {
        color: #A8C8BA;
        font-size: 18px;
    }
}